HTML5 的基本结构 | 江离书生

如果读者已有 HTML4、XHTML 的基础，应该记得 XHTML 文档中必须具有 DOCTYPE 声明，它位于 HTML 文档的第一行，代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

而 HTML5 则非常简单，只要把 XHTML 中的 DTD 声明改为如下形式即可。

<!DOCTYPE html>

上面的 DTD 定义并不符合 XML 文档的 DTD 语法——这也正好符合 HTML5 的设计哲学：HTML5 并不是“规范优先”的设计，HTML5 是“妥协式”的规范，它照顾了互联网上大量不规范的 HTML 页面。因此 HTML5 并不需要严格意义上的 DTD。

HTML5 对元素大小写不再严格区分，开发者可以随意使用大小写字符来定义 HTML 元素。

对于一份基本的 HTML5 文档而言，它总有如下结构：

<!DOCTYPE html>
<html>
    <head>
        <title>页面标题</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <!-- 此处还可插入其他 meta、样式单等信息 -->
    </head>
    <body>
        页面内容部分
    </body>
</html>

从上面代码中可以看出，HTML5 文档的根元素依然是<html...>，这是固定不变的内容。在<html...>元素里包含<head...>和<body...>两个子元素。<head...>元素主要定义 HTML5 文档的页面头，其中<title...>元素用于定义页面主体，包括页面的文本内容和绝大部分标签。

当然，在使用工具时，也可以在 DOCTYPE 声明中加入 SYSTEM 声明，声明方法如下：

<!DOCTYPE html SYSTEM "about:legacy-compat">

HTML5 支持两种方式来指定页面的字符集。

使用 Content-Type 指定页面所用的字符集。例如以下代码：

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

直接使用 charset 指定页面所用的字符集。例如以下代码：

<meta charset="utf-8" />

需要指出的是，从 HTML5 开始，HTML 文档推荐使用 UTF-8 字符集。

不要在<html>和<head>之间插入任何内容！不要在</head>和<body>之间插入任何内容！不要在</body>和</html>之间插入任何内容！

如果说 HTML5 的语法发生了一些变化，这些变化的最大特征就是：HTML5 更宽容了！HTML5 规范的设计初衷就是最大限度地“兼容”互联网上随处可见的不规范页面。

归纳起来，HTML5 存在如下几点语法变化。